fix(web): real upload button + visible preview-toggle#10
Merged
SwathiMystery merged 1 commit intomainfrom Apr 21, 2026
Merged
Conversation
Two usability issues on the rich-notes editor:
1. No way to upload an image
- The toolbar used EasyMDE's 'image' item, which only inserts a
literal '' placeholder line. The 'upload-image' item
is the one that fires a file-picker and calls imageUploadFunction.
- Swapped 'image' → 'upload-image' (only when an upload URL is
wired; falls back to 'image' otherwise).
- Also set imageAccept + imageMaxSize explicitly so paste / drag-drop
match the server-side allowlist (png/jpg/webp/gif, 10 MB).
2. Preview mode felt like a one-way door
- EasyMDE disables the rest of the toolbar during preview and the
user couldn't see a clear way back.
- Defined a custom 'preview' toolbar item with a descriptive title
('Toggle preview (click again to go back)') and the no-disable
flag so the button stays fully interactive while other buttons dim.
- CSS: disabled-for-preview buttons now have opacity 0.35 (visibly
greyed, not vanished) so the user still sees the toolbar.
- Active-state styling bumped: filled accent background instead of
just an accent-coloured icon, so toggles read at a glance.
- Added 'fullscreen' to the toolbar for distraction-free writing.
Paste + drag-drop upload continue to work via EasyMDE's own handlers
(they fire imageUploadFunction whenever uploadImage is true).
Tests unchanged; 46/46 still green.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Two usability bugs in the notes editor:
Why
Changes
`editor.js`
`style.css`
Verification
```
POST /upload/note/day/2026-04-15 → 200 {"url": "/media/2026/04/21/.png"}
GET /media/2026/04/21/.png → 200 (image/png)
```
Checklist